<template>
  <div class="mail_signature">
    <configCompositionTwoWindowStyle>
        <template slot="card">
          <search
            :inputTitle="$t('configLazyLoad.channel.mailTip24')"
            @add="addSignature"
            @refresh="refresh"
            @turnPage="turnPage"
            :showAdvSearch="false"
            :currentPage="currentPage"
            :count="count"
            :pageSize="10"
            :isReloadIvr="false"
            :isShowInput="false">
          </search>
          <diyTable @updata="updata" @previewFun="preview" @del="del" :tableHeader="tableHeader" :tableData="tableData" :preview="'true'"></diyTable>
        </template>
        <template slot="detail">
          <div class="bread_crumb_box" v-if="isShowAddOrEdit">
            <breadCrumb  @back="cancel" :titleArr="titleArr"></breadCrumb>
          </div>
          <div v-if="isShowAddOrEdit" v-loading="isLoadingAddOrEdit">
            <MailSignatureEdit :mailSignature="mailSignature" :flag="rightShow" @submit="submit" :todoFlag="todoFlag" :updateRandom="updateRandom" :formResetRandom="formResetRandom"></MailSignatureEdit>
          </div>
        </template>
      </configCompositionTwoWindowStyle>
  </div>
</template>
<script>
  import configCompositionTwoWindowStyle from '../../../../ui-modules/config/configCompositionTwoWindowStyle'
  import search from '../base/search'
  import breadCrumb from '../../../../ui-modules/breadCrumb/BreadCrumbConfig.vue'
  import diyTable from '../base/diyTable'
  import MailSignatureEdit from './MailSignatureEdit.vue'

  function querySignList (store, data) {
    return store.dispatch('querySignList', data)
  }
  function deleteEmailSign (store, data) {
    let dataNew = {
      _id: data._id
    }
    return store.dispatch('deleteEmailSign', dataNew)
  }
  function updateEmailSign (store, data) {
    let dataNew = {
      _id: data._id,
      name: data.name,
      content: data.content
    }
    return store.dispatch('updateEmailSign', dataNew)
  }
  function saveEmailSign (store, data) {
    let dataNew = {
      name: data.name,
      content: data.content
    }
    return store.dispatch('saveEmailSign', dataNew)
  }

  export default {
    name: 'MailSignature',
    data () {
      return {
        count: 0,           // 总条数
        currentPage: 1,    //   当前页
        tableHeader: [
          {prop: 'name', label: this.$t('configLazyLoad.channel.mailTip25')},
          {prop: 'updateTime', label: this.$t('config.channel.lastUpdateTime')},
          {prop: '', label: this.$t('public.operate')}
        ],
        tableData: [],           //  表格数据
        tableLoading: false,
        isShowAddOrEdit: false,
        isLoadingAddOrEdit: false,
        titleArr: [this.$t('configLazyLoad.channel.mailTip26'), this.$t('configLazyLoad.channel.mailTip27')],
        mailSignature: {
          name: '',
          content: ''
        },
        rightShow: '',
        updateRandom: 0,
        formResetRandom: 0
      }
    },
    components: {
      breadCrumb,
      configCompositionTwoWindowStyle,
      search,
      diyTable,
      MailSignatureEdit
    },
    methods: {
//        添加邮件签名
      addSignature () {
        this.todoFlag = 'add'
        this.rightShow = 'update'
        this.isShowAddOrEdit = true
        this.titleArr = [this.$t('configLazyLoad.channel.mailTip26'), this.$t('configLazyLoad.channel.mailTip27')]
        this.formResetRandom = Math.random()
        this.updateRandom = Math.random()
        this.mailSignature = {
          name: '',
          content: ''
        }
      },
//      刷新
      refresh () {
        this.search()
        this.isShowAddOrEdit = false
      },
//      翻页
      turnPage (val) {
        this.currentPage = val
        this.search()
      },
//      返回/取消
      cancel () {
        this.isShowAddOrEdit = false
        this.mailSignature = {
          name: '',
          content: ''
        }
      },
//      修改邮件签名
      updata (data) {
        this.todoFlag = 'update'
        this.isShowAddOrEdit = true
        this.titleArr = [this.$t('configLazyLoad.channel.mailTip26'), this.$t('configLazyLoad.channel.mailTip28')]
        this.mailSignature = data
        this.rightShow = 'update'
        this.formResetRandom = Math.random()
        this.updateRandom = Math.random()
      },
//      保存添加/修改
      submit (data) {
        if (data.todo === 'update') {
          updateEmailSign(this.$store, data.obj).then(() => {
            this.cancel()
            this.search()
          })
        } else {
          saveEmailSign(this.$store, data.obj).then(() => {
            this.cancel()
            this.search()
          })
        }
      },
//      预览邮件签名
      preview (data) {
        this.isShowAddOrEdit = true
        this.mailSignature = data
        this.titleArr = [this.$t('configLazyLoad.channel.mailTip26'), this.$t('configLazyLoad.channel.mailTip29')]
        this.rightShow = 'preview'
      },
//      删除邮件签名
      del (data) {
        this.$confirm(this.$t('configLazyLoad.channel.mailTip30'), this.$t('public.delete'), {
          confirmButtonText: this.$t('public.confirm'),
          cancelButtonText: this.$t('public.cancel'),
          cancelButtonClass: 'primary_btn',
          confirmButtonClass: 'primary_btn',
          type: 'warning'
        }).then(() => {
          deleteEmailSign(this.$store, data).then(() => {
            this.cancel()
            this.search()
          })
        })
      },
//      获取邮件签名
      search () {
        let data = {
          page: this.currentPage,
          limit: 10
        }
        querySignList(this.$store, data).then((res) => {
          if (res.success) {
            this.tableData = res.list
            this.count = res.count
          }
        })
      }
    },
    beforeMount () {
      this.currentPage = 1
      this.search()
    }
  }
</script>
<style lang="stylus" scoped>
  .bread_crumb_box
    font-size 14px
</style>
